<h1>成绩查询</h1>
<div>
    <fieldset><!--对HTML进行分组的分组对象  分组设置 -->
        <legend>请输入学号查询</legend><!--设置分组名称  -->
<!--        <input  id="form" enctype="application/x-www-form-urlencoded">-->
            <input type="text" name="studentId" id="studentId">
            <input type="button" value="提交" onclick="doSubmit()">
        </form>

        <div class="box-body table-responsive no-padding" >
            <table class="table table-hover">
                <thead id="theadId">
                <tr id="thTr">

                </tr>
                </thead>
                <tbody id="tbody">
                <tr>
                    <td colspan="7">数据正在加载中...</td>
                </tr>
                </tbody>
            </table>
        </div>
    </fieldset>
</div>

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script type="text/javascript">
    function doSubmit() {
        var studentId=document.getElementById('studentId').value;
        var params="studentId="+studentId;
        console.log(studentId);
        var url="score/doFindOne"
        $.get(url,params,function (result) {
            $('#thTr').empty();
            $('#thTr').append(doCreateTheads(result));
            $('#tbody').empty();
            $('#tbody').append(doGetScore(result))
        })
        // axios.get(url+"?"+params)
        // .then(function (response) {
        //     console.log("success");
        //     //doGetScore(response);
        //     document.getElementById("theadTr").append( doCreateTheads(response));
        //     // ;
        //
        // }).catch(function () {
        //
        //     console.log("error");
        //     //console.log(response.data);
        // })


    }

   function doGetScore(result){
       if (result.data.currScores==null||Object.keys(result.data.currScores).length==0){
           $('#thTr').empty();
           $('#tbody').empty();
           $('#tbody').html("查无此人");
       }
       var size=Object.keys(result.data.currScores).length
       console.log("========="+size);
       var td;
       //表头循环 拼接 科目名称
       for (i=0;i<size;i++){
           var a=`<td>${result.data.currScores[i].score}</td>`;
           td=td+a;
       }
       td=td+`<td>${result.data.totalScore}</td>
               <td>${result.data.totalCredit}</td>
               `;
       return td;
    }
    function doCreateTheads(result) {
        // if (result.data.currScores==null||Object.keys(result.data.currScores).length==0){
        //     $('#thTr').empty();
        //
        // }
        //console.log(result.data.currScores[0].currId);
        var size=Object.keys(result.data.currScores).length
        console.log("========="+size);
        var th;
        //表头循环 拼接 科目名称
        for (i=0;i<size;i++){
            var a=`<th>${GetNames(result.data.currScores[i].currId)}</th>`;
            th=th+a;
        }
        th=th+`<th>总分</th>
               <th>总学分</th>
               `;
        return th;
    }
    function GetNames (currId) {
        console.log("haha"+currId);
        var url="score/findNameByCurrId"
        var params={"currId":currId};
        var currName;
        $.ajax({
            url:url,
            data:params,
            async:false,
            dataType:"json",
            success:function (result) {
                console.log(result.message);
                currName=result.message;
            }
        })
        // $.get(url,params,function (result) {
        //     console.log(result.data);
        //
        // })
        return currName;
    }
</script>